<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0 ,minimum-scale=1.0 ,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>演出活动</title>
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/iconfont.css"/>
    <link rel="stylesheet" href="../css/footer.css"/>
    <script src="../js/jquery-1.8.3.min.js"></script>
    <style>
        body{background-color: #edecf1;}
        .header .center{text-overflow: ellipsis;overflow: hidden;white-space:nowrap;}
        .content ul li{margin-bottom: 15px;}
        .content ul li a{display: block;}
        .content ul li a img{display: block;width: 100%;}
        .content ul li a div{background-color: #fff;padding: 12px;}
        .content ul li a div span{color: #333;font-size: 14px;}
        .content ul li a div p{font-size: 12px;margin-top: 8px;}
    </style>
</head>
<body>
<script src="../js/overall_mask.js"></script>
    <header class="header header2">
        <div class="header-fixed">
            <div class="left">
                <a href="javascript:window.history.back();">
                    <i class="iconfont icon-arrowleft"></i>
                </a>
            </div>
            <div class="center">舞台剧《战马》中文版亚洲巡回演出</div>
        </div>
    </header>
    <div class="content">
        <ul>
            <li>
                <a href="../html/show_detail.html">
                    <img src="../img/pic_activity1.png" alt=""/>
                    <div>
                        <span>舞台剧《战马》中文版亚洲巡回演出-北京站</span>
                        <p>舞台剧《战马》是一个关乎友谊，勇敢，坚韧，信念的故事。</p>
                    </div>
                </a>
            </li>
            <li>
                <a href="../html/show_detail.html">
                    <img src="../img/pic_activity2.png" alt=""/>
                    <div>
                        <span>舞台剧《战马》中文版亚洲巡回演出-北京站</span>
                        <p>舞台剧《战马》是一个关乎友谊，勇敢，坚韧，信念的故事。</p>
                    </div>
                </a>
            </li>
            <li>
                <a href="../html/show_detail.html">
                    <img src="../img/pic_activity3.png" alt=""/>
                    <div>
                        <span>舞台剧《战马》中文版亚洲巡回演出-北京站</span>
                        <p>舞台剧《战马》是一个关乎友谊，勇敢，坚韧，信念的故事。</p>
                    </div>
                </a>
            </li>
        </ul>
    </div>
<footer class="footer">
    <div class="footer-fixed">
        <div class="foot-bar">
            <a href="../html/index.html">
                <div>
                    <i class="iconfont icon-home"></i>
                </div>
                <p>首页</p>
            </a>
            <a href="../html/task.html">
                <div>
                    <i class="iconfont icon-renwu"></i>
                </div>
                <p>任务</p>
            </a>
            <a href="javascript:void(0);" class="center">
                <div>
                    <div class="plus">
                        <i class="iconfont icon-plus"></i>
                    </div>
                </div>
                <p>发布</p>
            </a>
            <a href="javascript:void(0);" class="active">
                <div>
                    <i class="iconfont icon-faxian-copy-copy"></i>
                </div>
                <p>发现</p>
            </a>
            <a href="../html/center.html">
                <div>
                    <i class="iconfont icon-user"></i>
                </div>
                <p>我</p>
            </a>
        </div>
        <div class="two-btn">
            <a href="../html/publish_want.html">雇主发布</a>
            <a href="../html/add_service.html">出租人发布</a>
        </div>
    </div>
</footer>
</body>
<script>
    $('.center .plus').click(function(){
        $('.two-btn').slideToggle();
        if($(this).hasClass('plus-active')){
            $(this).removeClass('plus-active');
            $(this).css({'transform':'rotate(0deg)','-webkit-transform':'rotate(0deg)'});
            $('.content').removeClass('filter');
        }else{
            $(this).addClass('plus-active');
            $(this).css({'transform':'rotate(45deg)','-webkit-transform':'rotate(45deg)'});
            $('.content').addClass('filter');
        }
    })
</script>
</html>